<template>
	<view class="member-box">
		<view class="avatar-nickname">
			<image src="https://img1.beise.com/hospital/20201124/1606189652403407.jpg"></image>
			<view class="welcome" v-if="isLogin">
				<text>贝贝(默认昵称)</text>
				<text>Hi,欢迎回来</text>
			</view>
			<view class="welcome" v-else>
				<text class="loginBtn" @click="toLogin">还未登录哦，请先登录</text>
			</view>
		</view>
		<view class="list-ul">
			<view class="list-ul-item">
				<text>用户协议</text>
				<text>></text>
			</view>
			<view class="list-ul-item">
				<text>隐私保护</text>
				<text>></text>
			</view>
			<view class="list-ul-item">
				<text>关于我们</text>
				<text>></text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isLogin:false,
				userid:0,
				userInfo:{}
			}
		},
		onLoad() {
			this.userid = uni.getStorageSync('member_userid');
			getUserInfo();
		},
		methods: {
			toLogin(){
				uni.redirectTo({
					url:'../login/login'
				})
			},
			async getUserInfo(){
				const res = await this.$myRequest({
					url:'/index.php?m=app&c=my&a=user_info&userid'+this.userid
				})
				this.userInfo = res.data.data
				console.log(this.userInfo);
			}
		}
	}
</script>

<style>
	/* .member-box{
		border: 1px solid red;
	} */
	.avatar-nickname{
		display: flex;
		justify-content: flex-start;
		padding: 10px;
	}
	.avatar-nickname image{
		width: 60px;
		height: 60px;
		border-radius: 50%;
	}
	.avatar-nickname .welcome{
		display: flex;
		flex-direction: column;
		padding-top: 5px;
		padding-left: 10px;
	}
	.avatar-nickname .welcome text:nth-child(2){
		font-size: 14px;
		color: #989898;
		margin-top: 5px;
	}
	.list-ul{
		border-top: 5px solid #f7f4f4;
		padding: 10px 5px;
		margin-top: 20px;
	}
	.list-ul-item{
		padding: 10px;
		display: flex;
		justify-content: space-between;
		font-size: 14px;
		box-shadow: 0px 2px 2px #d7d3d3;
		margin: 10px auto;
	}
	.loginBtn{
		display: block;
		margin-top: 15px;
		margin-left: 10px;
		text-decoration: underline;
	}
	.loginBtn:hover{
		color: #ff9d00;
		text-decoration: none;
	}
</style>
